<template>
    <div id="signup">
        <h3>注册成功,{{second}}秒后自动跳转登录页面</h3>
        <div>
            <v-btn color="blue" dark class="mb-1" @click="login()">去登录</v-btn>
        </div>
        <!-- <p>倒计时：{{hour}}:{{minute}}:{{second}}</p> -->
    </div>
</template>
<script>
export default {
    data() {
        return {
            // 定义变量初始值
            hours: 0,
            minutes: 0,
            seconds: 5
        }
    },
    mounted() {
        this.add();
    },
    methods: {
        login(){
        this.$router.push("/signUp")
        console.log('==>去登录按钮被点击')
        },
        // 防止数值小于10时，出现一位数
        // num(n) {
        //     return n < 10 ? '0' + n : '' + n
        // },
        // 倒计时函数
        add() {
            // 完整的时:分:秒判断，可以简化直接判断seconds
            let time = window.setInterval( ()=> {
                if (this.hours !== 0 && this.minutes === 0 && this.seconds === 0) {
                    this.hours -= 1;
                    this.minutes = 59;
                    this.seconds = 59;
                } else if (this.hours === 0 && this.minutes !== 0 && this.seconds ===
                    0) {
                    this.minutes -= 1;
                    this.seconds = 59;
                } else if (this.hours === 0 && this.minutes === 0 && this.seconds ===
                    0) {
                    this.seconds = 0
                    window.clearInterval(time)
                } else if (this.hours !== 0 && this.minutes !== 0 && this.seconds ===
                    0) {
                    this.minutes -= 1;
                    this.seconds = 59;
                } else {
                    this.seconds -= 1;
                }
            }, 1000)
        }
    },
    // watch: {
    //     // 监听数值变化
    //     second: {
    //         handler(newVal) {
    //             this.num(newVal)
    //         }
    //     },
    //     minute: {
    //         handler(newVal) {
    //             this.num(newVal)
    //         }
    //     },
    //     hour: {
    //         handler(newVal) {
    //             this.num(newVal)
    //         }
    //     }
    // },
    computed: {
        second() {
            return this.seconds
        },
        // 初始化数据
        // second() {
        //     return this.num(this.seconds)
        // },
        // minute() {
        //     return this.num(this.minutes)
        // },
        // hour() {
        //     return this.num(this.hours)
        // }
    }
}
</script>

<style scoped>
#signup{
    width: 100%;
    font-size:50px; /* 间距设置 */
    margin: 0;
    position: fixed;
    top: 30%;
}

</style>